import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import Components from 'unplugin-vue-components/vite'
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'
import { visualizer } from 'rollup-plugin-visualizer' // 资源视图
import compressPlugin from 'vite-plugin-compression'

const renderList = ['vue', 'ant-design-vue', 'axios', 'dayjs']
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    Components({
      resolvers: [
        AntDesignVueResolver({
          importStyle: false // css in js
        })
      ]
    }),
    compressPlugin({
      verbose: true,
      disable: false,
      include: /\.jsx?|\.css$/i, // 只压缩JS和CSS文件
      threshold: 10240
    }),
    visualizer({
      emitFile: false,
      filename: 'stats.html',
      open: true,
      sourcemap: true
    })

  ],
  server: {
    port: '30008',
    host: '0.0.0.0',
    headers: {
      'Access-Control-Allow-Origin': '*'
    },
    proxy: {
      '^/adminApi': {
        // target: 'http://127.0.0.1:3000/adminApi',
        target: 'http://1.94.168.247:20017/adminApi', // 代理服务器开放端口
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/adminApi/, '')
      },
      '^/video-temp': {
        // target: 'http://127.0.0.1:3000/video-temp',
        target: 'http://1.94.168.247:20017/video-temp',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/video-temp/, '')
      }
    }
  },

  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    },
    extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
  },
  optimizeDeps: {
    include: [
      `monaco-editor/esm/vs/language/json/json.worker`,
      `monaco-editor/esm/vs/language/css/css.worker`,
      `monaco-editor/esm/vs/language/html/html.worker`,
      `monaco-editor/esm/vs/language/typescript/ts.worker`,
      `monaco-editor/esm/vs/editor/editor.worker`
    ]
  },
  build: {
    // 单个文件默认大于500kb会报警告
    chunkSizeWarningLimit: 500, // 单位是KB
    sourcemap: false, // 生成 sourcemap 文件
    minify: 'terser', // 使用 terser 进行代码压缩
    rollupOptions: {
      output: {
        // 静态资源打包做处理
        // 分包 chunk 的目录
        chunkFileNames: 'static/js/[name]-[hash].js',
        // 入口 chunk 的目录
        entryFileNames: 'static/js/[name]-[hash].js',
        assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
        manualChunks: (id) => {
          if (id.includes('node_modules')) {
            // 这里代码可以优化一下，但是我懒，我相信你一定可以的！
            if (id.includes('ant-design-vue')) {
              return 'ant-design-vue'
            } else if (id.includes('dayjs')) {
              return 'dayjs'
            } else if (id.includes('lodash')) {
              return 'lodash'
            } else if (id.includes('monaco-editor')) {
              return 'monaco-editor'
            }
              // else if (id.includes('vue')) {
              //   return 'vue'
            // }
            else if (id.includes('vue-router')) {
              return 'vue-router'
            } else if (id.includes('pinia')) {
              return 'pinia'
            } else if (id.includes('wangeditor')) {
              return 'wangeditor'
            } else if (id.includes('hls')) {
              return 'hls'
            } else {
              return 'vendor'
            }
          } else {
            return 'app'
          }
        }
      }
    },

    // 移除 console & debugger
    terserOptions: {
      compress: {
        drop_console: true,
        drop_debugger: true
      },
      output: {
        comments: false // 移除注释
      }
    }
  }
})
